import axios, { InternalAxiosRequestConfig, AxiosRequestConfig, AxiosResponse } from 'axios'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useUserStore } from '@/store/modules/user'
import EmojiText from '../emojo'

const axiosInstance = axios.create({
    timeout: 15000, // 请求超时时间(毫秒)
    baseURL: import.meta.env.VITE_API_URL, // API地址
    withCredentials: true, // 异步请求携带cookie
    transformRequest: [(data) => JSON.stringify(data)], // 请求数据转换为 JSON 字符串
    validateStatus: (status) => status >= 200 && status < 300, // 只接受 2xx 的状态码
    headers: {
        get: { 'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8' },
        post: { 'Content-Type': 'application/json;charset=utf-8' }
    },
    transformResponse: [
        (data) => {
            // 响应数据转换
            try {
                return typeof data === 'string' && data.startsWith('{') ? JSON.parse(data) : data
            } catch {
                return data // 解析失败时返回原数据
            }
        }
    ]
})

// 请求拦截器
axiosInstance.interceptors.request.use(
    (request: InternalAxiosRequestConfig) => {
        const { token } = useUserStore().info
        // 如果 token 存在，则设置请求头
        if (token) {
            request.headers['Content-Type'] = 'application/json'
            //request.headers['Authorization'] = token // 如果你需要使用 Authorization 头
            request.headers['token'] = token
        }

        return request // 返回修改后的配置
    },
    (error) => {
        ElMessage.error(`服务器异常！ ${EmojiText[500]}`) // 显示错误消息
        return Promise.reject(error) // 返回拒绝的 Promise
    }
)

// 响应拦截器
axiosInstance.interceptors.response.use(
    (response: AxiosResponse) => response,
    (error) => {
        if (axios.isCancel(error)) {
            console.log('repeated request: ' + error.message)
        }

        if (error.response && error.response.status === 500) {
            const errorMessage = error.response.data.message
            ElMessage.error(
                errorMessage
                    ? `${errorMessage} ${EmojiText[500]}`
                    : `请求超时或服务器异常！${EmojiText[500]}`
            )
        }

        const { status, data } = error.response
        // 验证错误
        const info = data.errors ? data.errors.map((item) => `<li>${item}</li>`).join('') : ''
        const msg = `<ul style="line-height: 1.6">${info}</ul>`

        // 401错误，Token值错误，需要重新登录
        if (status === 401 || status === 4001) {
            ElMessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
                confirmButtonText: '重新登录',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                // 清除浏览器全部临时缓存
                localStorage.clear()
                sessionStorage.clear()
                window.location.href = '/#/login' // 去登录页
            })
        }

        ElMessage({
            message: msg,
            type: 'error',
            dangerouslyUseHTMLString: true,
            duration: 3 * 1000
        })
        return Promise.reject(error)
    }
)

// 请求
async function request<T = any>(config: AxiosRequestConfig): Promise<T> {
    // 将 POST | PUT 请求的参数放入 data 中，并清空 params
    if (config.method === 'POST' || config.method === 'PUT') {
        config.data = config.params
        config.params = {}
    }
    try {
        const res = await axiosInstance.request<T>({ ...config })
        return res.data
    } catch (e) {
        if (axios.isAxiosError(e)) {
            // 可以在这里处理 Axios 错误
        }
        return Promise.reject(e)
    }
}

// API 方法集合
const api = {
    get<T>(config: AxiosRequestConfig): Promise<T> {
        return request({ ...config, method: 'GET' }) // GET 请求
    },
    post<T>(config: AxiosRequestConfig): Promise<T> {
        return request({ ...config, method: 'POST' }) // POST 请求
    },
    put<T>(config: AxiosRequestConfig): Promise<T> {
        return request({ ...config, method: 'PUT' }) // PUT 请求
    },
    del<T>(config: AxiosRequestConfig): Promise<T> {
        return request({ ...config, method: 'DELETE' }) // DELETE 请求
    }
}

export default api
